import '@/js/layui_exts/admin.js'

export function init() {
    layui.use(() => {
        const $ = layui.jquery, admin = layui.admin, form = layui.form, table = layui.table

        let amdType;
        const amdUser = user => {
            amdType = user ? 'modify' : 'add'
            layer.open({
                type: 1,
                title: user ? ('<i class="layui-icon-edit layui-icon"></i>&nbsp;编辑用户【' + user.username + '】') : ('<i class="layui-icon-add-circle layui-icon"></i>&nbsp;添加用户'),
                offset: user ? 'r' : 'l',
                anim: user ? 'slideLeft' : 'slideRight',
                shade: 0.3,
                area: ['500px', '100%'],
                shadeClose: true,
                scrollbar: false,
                id: 'amd-user-id',
                content: $('#amd-user-content')
            })

            admin.enumRadio('sex', 'userSex', user?.sex, true)

            if (user)
                $('input[name=username]').attr('disabled', 'disabled')
            else
                $('input[name=username]').removeAttr('disabled')

            form.val('amd-user-form-filter', user ?? {
                id: '',
                username: '',
                realname: '',
                sex: '',
                phone: '',
                email: ''
            })
        }
        const rmUser = user => admin.confirm('确定删除【' + user.username + '】吗？', () => admin.postM('sys/user/remove', {id: user.id}, () => table.reload('user-table')), '删除提示')

        const grantUser = user => {
            layer.open({
                type: 1,
                title: '<i class="layui-icon-auz layui-icon"></i>&nbsp;用户绑定角色【' + user.username + '】',
                offset: 'r',
                anim: 'slideLeft',
                shade: 0.3,
                area: ['500px', '100%'],
                shadeClose: true,
                scrollbar: false,
                id: 'user-bind-role-id',
                content: $('#user-role-content')
            })
            table.render({
                elem: '#user-role-table',
                url: '/api/sys/user_role/list/' + user.id,
                headers: {
                    'Authorization': admin.getToken()
                },
                height: 'full-70',
                parseData: ({code, msg, data}) => {
                    let d = JSON.parse(admin.decrypt(data))
                    return {
                        "code": code === 200 ? 0 : code,
                        "msg": msg,
                        "count": d.length,
                        "data": d
                    }
                },
                cols: [[{
                    type: 'checkbox'
                }, {
                    type: 'numbers',
                    title: '序号'
                }, {
                    field: 'name',
                    title: '名称'
                }, {
                    field: 'code',
                    align: 'center',
                    title: '编码'
                }]]
            })

            table.on('checkbox(user-role-table)', ({checked, type, data}) =>
                admin.postM('sys/user_role/grant', {
                    uid: user.id,
                    checked,
                    type,
                    rid: data?.id
                }))
        }

        const reloadTable = () => table.reloadData('user-table', {
            where: {
                search: $('input[name=search]').val()
            }
        })

        admin.enumObj('userSex').then(sex => {
            table.render({
                elem: '#user-table',
                url: '/api/sys/user/page',
                headers: {
                    'Authorization': admin.getToken()
                },
                parseData: ({code, msg, data}) => {
                    let d = JSON.parse(admin.decrypt(data))
                    return {
                        "code": code === 200 ? 0 : code,
                        "msg": msg,
                        "count": d.total,
                        "data": d.records
                    }
                },
                toolbar: '#user-table-toolbar',
                cols: [[{
                    type: 'numbers',
                    title: '序号'
                }, {
                    field: 'username',
                    title: '账号'
                }, {
                    field: 'realname',
                    title: '姓名'
                }, {
                    field: 'sex',
                    align: 'center',
                    title: '性别',
                    width: 120,
                    templet: d => sex[d.sex]
                }, {
                    field: 'phone',
                    align: 'center',
                    title: '手机'
                }, {
                    field: 'email',
                    title: '邮箱'
                }, {
                    title: '操作',
                    align: 'center',
                    width: 300,
                    toolbar: '#user-table-tools'
                }]],
                page: true,
                done: () => admin.perm()
            })

            table.on("tool(user-table)", ({event, data}) => {
                switch (event) {
                    case 'md':
                        amdUser(data)
                        break;

                    case 'rm':
                        rmUser(data)
                        break;

                    case 'grant':
                        grantUser(data)
                        break;
                }
            })

            table.on("toolbar(user-table)", ({event}) => {
                switch (event) {
                    case 'add':
                        amdUser()
                        break;

                    case 'search':
                        reloadTable()
                        break;

                    case 'reset':
                        $('input[name=search]').val('')
                        reloadTable()
                        break;
                }
            })

            $('input[name=search]').keydown(e => {
                if (e.keyCode === 13)
                    reloadTable()
            })
        })

        form.on('submit(submit-amd-user-form)', ({field}) => {
            admin.postM('sys/user/' + amdType, field, () => {
                layer.closeAll('page')
                table.reload('user-table')
            })
            return false
        })
    })

    return {};
}
